<script type="text/javascript">
			$(function(){
				// Dialog			
				$('#dialog').dialog({
					modal:true,
					autoOpen: false,
					width: 300,
					show: "fold",
					hide: "scale",
					buttons: {
						"Si": function() {
							if(validarFormulario(this)){
									agregarrol();
							} else {
								$(this).dialog("close"); 
							 	//alert("Falta llenar campos Obligatorios");
							}
							$(this).dialog("close"); 
						}, 
						"No": function() { 
							$(this).dialog("close"); 
						} 
					}
				});
				
				//DialogCancelar
				$('#dialogCancela').dialog({
					modal:true,
					autoOpen: false,
					width: 300,
					show: "fold",
					hide: "scale",
					buttons: {
						"Si": function() {
							salir();
							$(this).dialog("close"); 
						}, 
						"No": function() { 
							$(this).dialog("close"); 
						} 
					}
				});				
				
				// Dialog Link
				$('#dialog_link').click(function(){
					$('#dialog').dialog('open');
					return false;
				});

				$('#dialog_link_cancela').click(function(){
					$('#dialogCancela').dialog('open');
					return false;
				});
			});	
			
			jQuery(document).ready( function() {
                // binds form submission and fields to the validation engine
                jQuery("#form_valida").validationEngine();
            });
</script>
<style type="text/css">
	body{ font: 62.5% "Trebuchet MS", sans-serif; margin: auto;}
	.demoHeaders { margin-top: 2em; }
	#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
	#dialog_link_cancela {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
	#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
	#dialog_link_cancela span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
	ul#icons {margin: 0; padding: 0;}
	ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left;  list-style: none;}
	ul#icons span.ui-icon {float: left; margin: 0 4px;}
input:disabled{
background-color:#EDEDED;
-moz-border-radius:3px;
border: 1px solid #000080;
color : #979797;
}
</style>
<br/><br/>
<h1>Nuevo Rol</h1><br/>
<table width=500>
<tr>
<td >
	<div id="menuv">
		<ul>
			<?php $menuOpciones = new Acceso_Model_Usuario(); 
			$opciones = $menuOpciones->carga_opciones($this->id,$this->id_padre); 
			for($o =0;$o<count($opciones);$o++){ ?>
			<li><a href="<?php echo $this->baseUrl."/".$opciones[$o]->descripcion."/id/".$this->id."/idp/".$this->id_padre; ?>"><?php echo $opciones[$o]->nombre; ?></a></li>
			<?php }; ?>
		</ul>
	</div>
</td>

<td bgcolor="darkgray" width="3%">&nbsp;</td>
<td>
<div id="mensaje"></div>
<center>
<div id="forma1" style="right: 65px; width:70%">
<form action="" id="form_valida" name="form_valida" method="post" onSubmit="return validateFields();" >
    <br />
 <!--//////////////REGISTRO DE DATOS PERSONALES DEL USURIO////////////////////////////77 -->
 <fieldset> <legend>Datos del Rol</legend> 
    <!-- TABLA 1 -->
   <table border="0"  style="right: 65px;" >
   <tbody>
    <tr>      
      <td  height="52"><!-- usuario -->
          <label>N° Rol :</label> <input name="id_rol" readonly="readonly" id="id_rol" value="<?php echo $this->escape($this->id_rol); ?>" size="10" type="text" />
      </td>
    </tr>
    <tr colspan="3">
      <td height="52" width="35%"><!-- NOMBRE -->
         <label for="nombres" class="required">Nombre:</label><br/>
         <input name="nombres" id="nombres" size="70" type="text" class="validate[required]" />
      </td>
	  <td width="10%"></td>
	  <td height="52" width="35%">
      </td>
    </tr>
	<tr>
	  <td height="52"><!-- ES ROL PADRE -->
          <label for="es_rol_padre" class="required">Es Rol Padre:</label><br/>
          <input name="es_rol_padre" id="es_rol_padre" value="" size="15" type="checkbox" />
	  </td>
	  <td height="52"> <!-- ACTIVO -->
          <label for="activo" class="required">Activo:</label><br/>
          <input name="activo" id="activo" value="" size="15" type="checkbox" checked="true" />
      </td>
	  <td></td>
    </tr>
   </tbody>
   </table>
<br />
<!-- ///////////////////////////////////////////////////// -->
</fieldset> 
<br/>
</td></tr></table>
<!-- ///////////////////////////////////////////////////// -->
<!-- TABLA BOTONES -->

<br />
<table>
   <tr>
       <td style="width: 261px;">
       </td>
       <td style="width: 200px;" align="center">
			<p align="center"><button class="ui-state-default ui-corner-all" id="dialog_link">Guardar Datos</button></p>
			<div id="dialog" title="Guardar Datos">
				<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>Esta Seguro de Guardar los Datos.</p>			
			</div>
			<div id="loadingScreen"></div>		
			<div id="dialogmessage" title="Usuarios: Ingreso Usuarios">
				<br/><p>
				<span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>
				Los Datos Se Guardaron Exitosamente
				</p>			
			</div>
           <!--<submit type="button" class="button small blue" onclick="agregar();">Añadir Usuario</submit>-->
       </td>
       <td style="width: 204px;" align="center" >
			<p align="center"><button class="ui-state-default ui-corner-all" id="dialog_link_cancela">Cancelar</button></p>
			<div id="dialogCancela" title="Salir">
				<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>Desea Salir sin Guardar los Datos.</p>			
			</div>
           <!--<button  type="button"  class="button small blue" onClick="document.location = '<?php echo $this->url(array('controller' => 'index','action' => 'ingresado'));?>'" name="Cancelar">Cancelar</button>-->
       </td>
       <td style="width: 222px;">
       </td>
   </tr>
 </table>
 </br>
</form>
</div>
</center>
<div id = "errores"></div>
